<template>
    <div id="score">
        <div class="publishBox">
            <div class="publishBackground"></div>
            <div class="publishcontainer">
                <div class="head">
                    <span>作业评价</span>
                    <img @click="sendMsgToParent3">
                </div>
                
                <div style="font-size:10%;color:#afafaf;padding: 0 0 2% 3%;">{{ID}}-{{name}}-{{workName}}</div>
                <div class="scoreText">
                    <textarea v-model="evaluate"></textarea>
                </div>
                <div class="scoreInput">
                    <span>分数</span>
                    <input v-model="value" style="padding:2%;font-size:1px;width:15%;background:white;border:none;outline:none;" class="numInput" placeholder="分数">
                    <!-- <span style="margin-left:5%;">等级</span> -->
                    <!-- <el-select  v-model="value" clearable placeholder="选择">
                      <el-option v-for="item in scoreOptions" :key="item.value" :label="item.label" :value="item.value">
                      </el-option>
                    </el-select> -->
               </div>

               <div class="confirmButton">
                   <el-button type="primary" @click="sendMsgToParent3_submit">确定</el-button>
               </div>
            </div>
        </div>
    </div>
</template>
<script>
 import axios from 'axios'
     export default {
         data(){
             return{
                 evaluate:"",
                 value:"",
                 ID:'',
                 name:'',
                 workName:'',
                 props:["message3"],
                 scoreOptions:[
                     {
                        value:'选项1',
                        label:'优'
                    },
                    {
                        value:'选项2',
                        label:'良'
                    },
                    {
                        value:'选项3',
                        label:'中'
                    },
                    {
                        value:'选项4',
                        label:'及格'
                    },
                    {
                        value:'选项5',
                        label:'不及格'
                    },
                 ]
             }
         },
         props:["workData"],
         watch:{
            'workData': function() {
              this.evaluate= this.workData.evaluate;
              this.value= this.workData.score;
              this.ID=this.workData.userID
              this.name=this.workData.stuName
              this.workName=this.workData.workName
            }
          },
         methods:{
            sendMsgToParent3(){
                this.$emit("listenToChildEvent3","0")
            },
            sendMsgToParent3_submit(){
                if(this.value==""){
                    this.$message({
                        message:'请输入分数',
                        type:'warning'
                      });
                    return
                }
                this.$emit("listenToChildEvent3","0")
                
                var _this = this;
                var params = new URLSearchParams();
                params.append('course',this.workData.course);
                params.append('workName',this.workData.workName);
                params.append('score',this.value);
                params.append('evaluate',this.evaluate);
                let config = { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } };
                if(this.workData.isTeam==1){
                    //个人作业评分
                    params.append('userID',this.workData.userID);
                    axios.post('/studentWork/setScore',params,config).then(function (res) {
                        console.log(res.data)
                        if(res.data.stauts=="success"){
                            _this.$message({
                                message:'评分成功',
                                type:'success'
                            });
                        _this.$emit("setScore",_this.value)
                        }else if(res.data.msg=="该学生未提交作业"){
                            _this.$message({
                                message:'该学生未提交作业',
                                type:'warning'
                            });
                        }else if(res.data.msg=="作业不存在"){
                            _this.$message({
                                message:'作业不存在，请联系管理员',
                                type:'warning'
                            });
                        }
                    }).catch(function (err) {
                    console.log(err);
                    });
                }else if(this.workData.isTeam==2){
                    //团队作业评分
                    params.append('teamName',this.workData.teamName);
                    axios.post('/teamWork/setTeamScore',params,config).then(function (res) {
                        console.log(res.data)
                        if(res.data.stauts=="success"){
                            _this.$message({
                                message:'评分成功',
                                type:'success'
                            });
                        _this.$emit("setTeamScore",_this.value)
                        }else if(res.data.msg=="学生未交作业"){
                            _this.$message({
                                message:'该团队未提交作业',
                                type:'warning'
                            });
                        }
                    }).catch(function (err) {
                    console.log(err);
                    });
                }
                
            }
        },
    }
</script>
<style>
    #score .head{
        background-color: #eeeeee;
        text-align: center;
        margin:3% 0 0 0;
        padding: 0% 0 5% 0 ;
    }
    #score .head span{
        font-size: 90%
    } 
    #score .head img{
        top:6%;
        position: absolute;
        right: 5%;
        width: 10px;
        height: 10px;
        background: red;
    }
    #score .publishcontainer{
        top:37%;
        width: 20%;
        height:33%;
        border-radius: 3%;
        left:75%
    }
    #score .el-input__inner{
        text-align: center;
        padding:0 22px 0 5px;
        height:24px;
    }
    #score .el-select{
        font-size: 10px;
        width:25%;
    }
    #score .scoreText textarea {
        padding: 1%;;
        position: relative;
        left:50%;
        height: 50px;
        width: 90%;
        max-width: 100%;
        resize: none;
        outline: none;
        margin: 0 0 0 -46% ;
    }
    #score .scoreInput{
        margin: 0 0 0 5% ;
        font-size: 10%;
    }
   #score .el-input{
       font-size: 10px;
   }
   #score .el-input__suffix{
       right:1px;
   }
    #score .confirmButton el-button{
        
    }
   #score .confirmButton .el-button{
       padding: 0.5% ;
   }
   #score .el-button--primary{
       position: relative;
       font-size: 80%;
       left:80%;
   }
</style>